<template>
	<view
		style="width: 100%;height: 100vh;position: fixed;top: 0;left: 0;z-index: 100001;background-color: rgba(0, 0, 0, 0.5);"
		v-show="isShowPlayer">

		<view style="width: 100%;height: 100%;display: grid;">
			<view style="width: 100%;height: 20vh;" @click="closePlayer()">

			</view>
			<view style="width: 100%;height: 60vh;">

				<video id="video555666" :src="playUrl" :poster="poster" lazy-load playsinline webkit-playsinline
					:autoplay="true" object-fit="contain" :show-fullscreen-btn="false" :enable-progress-gesture="false"
					@error="videoErrorCallback"
					style="margin: 0 20rpx;width: calc(100% - 40rpx);height: 100%;border-radius: 16rpx;"
					controls></video>
			</view>
			<view style="width: 100%;height: 20vh;" @click="closePlayer()">

			</view>
		</view>

	</view>

</template>

<script>
	import animationType from '@/utils/animationType.js'
	export default {
		props: {},
		data() {
			return {
				isShowPlayer: false,
				closeImg: 'https://pic.mae.vip//crmebimage/public/maintain/2024/09/10/71f1a9aba07d46fdb88b81562904236fwes70ule49.png',
				playUrl: '',
				poster: ''
			}
		},
		mounted() {
			let that = this;
		},
		onLoad(options) {
			let that = this;

		},
		onShow() {
			let that = this;
		},
		methods: {
			videoErrorCallback: function(e) {
				//e.target.errMsg
			},
			sendUrl(params) {
				let that = this;
				that.isShowPlayer = true;
				that.playUrl = params.playUrl;
				that.poster = params.poster;
			},
			closePlayer() {
				this.isShowPlayer = false;
				uni.createVideoContext('video555666').pause(); // 暂停其他视频
			},
		},
	}
</script>

<style lang="scss" scoped>

</style>